﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="JqueryJSQR.aspx.cs" Inherits="WebApplication.JqueryJSQR" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        .text
        {
            width: 200px;
            padding: 5px;
        }
        .button
        {
            padding: 5px;
        }
        select
        {
            padding: 5px;
        }
    </style>
    <script src="Scripts/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="Scripts/jquery.qrcode.js"></script>
    <script type="text/javascript" src="Scripts/qrcode.js"></script>
    <script type="text/javascript">
        $(function () {
            for (var i = 1; i <= 500; i++) {
                $("#selectWidth").append("<option>" + i + "</option>");
            }
            $("#selectWidth").val("200");
            for (var i = 1; i <= 500; i++) {
                $("#selectHeight").append("<option>" + i + "</option>");
            }
            $("#selectHeight").val("200");
        })
        function update_qrcode() {
            var content = $("#content").val();
            var width = $("#selectWidth").val();
            var height = $("#selectHeight").val();
            var type = $("#selectType").val();
            jQuery('#qrcode').empty().qrcode({
                height: height,
                width: width,
                render: type,
                text: content
            });
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <input id="content" type="text" class="text" value="请输入内容" /><br />
    宽：
    <select id="selectWidth">
    </select>
    高：
    <select id="selectHeight">
    </select>
    类型：
    <select id="selectType">
        <option value="table">table</option>
        <option value="canvas">canvas</option>
    </select>
    <input type="button" value="生成" class="button" onclick="update_qrcode()" />
    <div id="qrcode">
    </div>
    <script type="text/javascript">
        
    </script>
    </form>
</body>
</html>
